import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';
import 'package:mtf/R.dart';
import 'package:mtf/app/data/VideoEntity.dart';
import 'package:mtf/app/modules/video_list_module/video_list_controller.dart';
import 'package:mtf/app/theme/app_colors.dart';
import 'package:mtf/app/widget/AppBarLeftTitle.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';

import 'dart:convert';

import '../../theme/app_boxDecoration.dart';
/**
 * GetX Template Generator - fb.com/htngu.99
 * */

class videoListPage extends GetView<videoListController> {
  @override
  Widget build(BuildContext context) {
    controller.reqVideoHome();
    return Obx(() {
      return DefaultTabController(
        length: 2,
        child: Scaffold(
            appBar:AppBarLeftTitle(title: "视频列表",),
            body:  Container(
              width: double.infinity,
              child: Column(
                children: [
                  Image.network('https://img0.baidu.com/it/u=4071201799,223427537&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=218'),
                  Container(width: double.infinity,height:50,child:
                  PreferredSize(
                    preferredSize: Size.fromHeight(45),
                    child: Material(
                      color: Colors.white,
                      child: TabBar(
                        indicatorColor: c_f12f38,
                        // 标签栏中选中的线（指示器）的颜色
                        indicatorSize: TabBarIndicatorSize.label,
                        // 线的长度
                        indicatorWeight: 3.0,
                        // 线的宽度
                        labelColor: c_333333,
                        unselectedLabelColor: c_666666,
                        tabs: controller.typeList.map((element) =>
                            Tab(text: element.typeName ?? "")).toList(),
                      ),
                    ),
                  ),),
                  TabBarView(
                    children: VideoFragPages(),
                  ),
                ],
              ),
            )

        ),
      );
    });
  }

  List<Widget> VideoFragPages() {
    List<Widget> pages = [];
    for (int i = 0; i < controller.typeList.length; i++) {
      RefreshController refreshController = RefreshController(
          initialRefresh: true);
      pages.add(RefreshConfiguration(
        headerBuilder: () => ClassicHeader(),
        footerBuilder: () => ClassicFooter(),
        child: SmartRefresher(
          controller: refreshController,
          enablePullDown: true,
          enablePullUp: true,
          onRefresh: () {},
          onLoading: () {},
          child: Container(
            margin: EdgeInsets.all(10),
            decoration: r10WhiteDecoration,
            child: ListView.separated(
                physics: NeverScrollableScrollPhysics(),
                separatorBuilder: (context, index) {
                  return Container(
                      margin: EdgeInsets.symmetric(horizontal: 15),
                      child: Divider(height: 1));
                },
                itemBuilder: (context, index) {
                  return itemVideo(controller.videoList[index]);
                },
                itemCount: 0,
                shrinkWrap: true),
          ),
        ),
      ));
    }
    return pages;
  }


  Widget itemVideo(ListVideoElement item) {
    return InkWell(
      onTap: () {
        controller.clickVideoDetail(item);
      },
      child: Container(
        margin: EdgeInsets.only(top: 15, left: 10, right: 10),
        child: Column(children: [
          Stack(
            alignment: Alignment.center,
            children: [
              ClipRRect(
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(10),
                    topRight: Radius.circular(10)),
                child: Image.network(
                  item.imghead ?? "https://via.placeholder.com/108x200",
                  fit: BoxFit.fill,
                  width: double.infinity,
                  height: 200,
                ),
              ),
              SvgPicture.asset(R.assetsImgIcSvgPlay, height: 45, width: 45,)
            ],
          ),
          Container(
            width: double.infinity,
            alignment: Alignment.centerLeft,
            padding: const EdgeInsets.symmetric(vertical: 12),
            decoration: const BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.only(
                    bottomLeft: Radius.circular(10),
                    bottomRight: Radius.circular(10))),
            child: Text(item.title ?? ""),
          )
        ]),
      ),
    );
  }

}
